<template>
	<view class="start">
		<view @click="goback">
			<image src="/static/zuojiantou.png" mode="widthFix" style="position: absolute;left: 20px;top: 25px;width: 15px;height: 15px;"></image>
		</view>
		<view class="red">
			<view class="topcontent">

			</view>
			<view class="topconttwo">

			</view>
		</view>
		<view class="img">

		</view>

		<view class="content">
			<image :src="face" style="width: 50px;height:50px;border-radius: 50%;margin-right: 5px;"></image>
			{{title}}的红包
		</view>
		<view style="color: #000000;text-align: center;">{{y_number}}</view>
		<!-- 		<view class="desc" style="color: #CCCCCC;">
			4个红包,共100.00元,27秒抢光
		</view> -->
		<view class="desc" style="color: #CCCCCC;" v-if="is_guoqi>0">
			{{num}}个红包,共{{hb_money}}{{hb_status==1?'元':'分'}},<text>{{money}}已退回</text>
		</view>
		<view class="desc" v-else style="color: #CCCCCC;">
			{{num}}个红包,共{{hb_money}}{{hb_status==1?'元':'分'}},<text v-if="jstime == '0秒'">{{money}}未领</text><text v-else>{{jstime}}领完</text>
		</view>
		<view class="infoper" v-for="(item,index) in personList" v-if="groupid!=0" @click="qbsfind(item)">
			<view class="left">
				<image :src="item.avatar" mode="" style="width: 30px;height: 30px;"></image>
				<view class="col">
					<text style="color: rgba(16, 16, 16, 1);font-size: 14px;text-align: left;font-family: PingFangSC-regular;">{{item.nickname}}</text>
					<view style="height: 5px;"></view>
					<text style="color: rgba(156, 156, 156, 1);font-size: 12px;text-align: left;font-family: PingFangSC-regular;">{{item.time}}</text>
				</view>
			</view>
			<view class="right">
				<view class="" style="font-size: 14px;text-align: right;margin-right: 15px;">
					<text style="margin-right: 5px;">{{item.z_money}}</text>

					<text>{{hb_status==1?'元':'分'}}</text>
				</view>
				<view style="height: 5px;"></view>
				
				<view class="" style="display: flex;justify-content: flex-end;align-items: center;margin-right: 15px">
					<text style="font-size: 12px;margin-right: 10px;font-weight: bold;" class="lock">{{item.zlname}}</text>
					<text style="font-size: 12px;color: #ffaa00;font-weight: bold;" class="lock" v-if="item.yqw=='运气王'"><image src="/static/myicon/huangguan.png" mode="" style="width: 20px;height: 20px;"></image>{{item.yqw}}</text>
				</view>
			</view>
		</view>
		<view class="infoper" v-if="groupid==0&&!seeList" >
			<view class="left">
				<image :src="jb_uid_avatar" mode=""></image>
				<view class="col">
					<text style="color: rgba(16, 16, 16, 1);font-size: 14px;text-align: left;font-family: PingFangSC-regular;">{{s_name}}</text>
					<view style="height: 5px;"></view>
					<text style="color: rgba(156, 156, 156, 1);font-size: 12px;text-align: left;font-family: PingFangSC-regular;">{{js_time}}</text>
				</view>
			</view>
			<view class="right">
				<view class="" style="font-size: 14px;text-align: right;margin-right: 15px;">
					<text style="margin-right: 5px;">{{money}}</text>
		
					<text>元</text>
				</view>
				<view style="height: 5px;"></view>
				<!-- <view class="" style="display: flex;justify-content: flex-end;align-items: center;margin-right: 15px">
					<text style="font-size: 12px;margin-right: 10px;" class="lock">{{item.zlname}}</text>
					<text style="font-size: 12px;" class="lock">{{item.yqw}}</text>
				</view> -->
			</view>
		</view>
		<!-- <view class="" style="border: 1px solid #EEEEEE; width: 100%;margin-left: 10px;margin-right: 10px;margin: 10px;"> -->

		</view>


	</view>
</template>

<script>
	export default {
		data() {
			return {
				rid: '',
				is_guoqi:'',
				groupid: '',
				face: '',
				num: '',
				money: '',
				hb_money: '',
				title: '',
				hb_status: '',
				personList: [],
				jstime: '',
				jb_uid_avatar:'',
				js_time:'',
				s_name:'',
				y_number:"",
				owner:'',
				newList:[],
				seeList:false
			}
		},
		onLoad(options) {
			if(options.zt==1111){
				this.seeList = true
				this.groupid = options.groupid
				let token = uni.getStorageSync('token')
				uni.request({
					url: this.G_base + '/api/lz/jfhbinfo',
					method: 'POST',
					header: {
						'content-type': 'application/x-www-form-urlencoded',
						'Authori-zation': 'Bearer ' + token
					},
					data: {
						qid:options.qid,
						hbid: options.hb_id,
					},
					success: res => {
						console.log(res)
						console.log("查看红包的详情")
						
						
						this.personList = res.data.data.list
						this.num = res.data.data.num
						this.hb_money = res.data.data.hb_money
						this.money = res.data.data.money
						this.jstime = res.data.data.jstime
						this.y_number = res.data.data.y_number
						this.title = res.data.data.title
						this.face = res.data.data.avatar
						this.is_guoqi = res.data.data.is_guoqi
						
						// this.personList = res.data.data.list
						// this.num = res.data.data.num
						// this.hb_money = res.data.data.hb_money
						// // this.money = res.data.data.money
						// this.jstime = res.data.data.jstime
						// this.y_number = res.data.data.y_number
						// this.title = res.data.data.title
						// this.face = res.data.data.avatar
						// this.is_guoqi = res.data.data.is_guoqi
					}
				})
				
				return
			}
			console.log(options)
			let myname = uni.getStorageSync('myUsername')
			let hbinfo = JSON.parse(options.hb_id)
			let type = hbinfo.type
			console.log(type)
			this.rid = hbinfo.hb_id
			this.groupid = options.groupid
			this.owner = options.owner
			let token = uni.getStorageSync("token")
			if(type==0&&this.owner!=myname){
				uni.request({
					url: this.G_base + '/api/lz/jfhbinfo',
					method: 'POST',
					header: {
						'content-type': 'application/x-www-form-urlencoded',
						'Authori-zation': 'Bearer ' + token
					},
					data: {
						qid:this.groupid,
						hbid: this.rid,
					},
					success: res => {
						console.log(res)
						console.log("不是群主查看详情")
						this.personList = res.data.data.list
						this.num = res.data.data.num
						this.hb_money = res.data.data.hb_money
						this.money = res.data.data.money
						this.jstime = res.data.data.jstime
						this.y_number = res.data.data.y_number
						this.title = res.data.data.title
						this.face = res.data.data.avatar
						this.is_guoqi = res.data.data.is_guoqi
					}
				})
			}
			if(type==0&&this.owner==myname){
				uni.request({
					url: this.G_base + '/api/lz/jfhbinfo',
					method: 'POST',
					header: {
						'content-type': 'application/x-www-form-urlencoded',
						'Authori-zation': 'Bearer ' + token
					},
					data: {
						qid:this.groupid,
						hbid: this.rid,
					},
					success: res => {
						console.log(res)
						console.log("查看红包的详情")
						this.personList = res.data.data.list
						this.num = res.data.data.num
						this.hb_money = res.data.data.hb_money
						this.money = res.data.data.money
						this.jstime = res.data.data.jstime
						this.y_number = res.data.data.y_number
						this.title = res.data.data.title
						this.face = res.data.data.avatar
						this.is_guoqi = res.data.data.is_guoqi
					}
				})
				// uni.request({
				// 	url: this.G_base + '/api/lz/jfqadd',
				// 	method: 'POST',
				// 	header: {
				// 		'content-type': 'application/x-www-form-urlencoded',
				// 		'Authori-zation': 'Bearer ' + token
				// 	},
				// 	data: {
				// 		qid:this.groupid,
				// 		hb_id: this.rid,
				// 	},
				// 	success: res => {
				// 		console.log(res)
				// 		uni.request({
				// 			url: this.G_base + '/api/lz/jfhbinfo',
				// 			method: 'POST',
				// 			header: {
				// 				'content-type': 'application/x-www-form-urlencoded',
				// 				'Authori-zation': 'Bearer ' + token
				// 			},
				// 			data: {
				// 				qid:this.groupid,
				// 				hbid: this.rid,
				// 			},
				// 			success: res => {
				// 				console.log(res)
				// 				console.log("查看红包的详情")
				// 				this.personList = res.data.data.list
				// 				this.num = res.data.data.num
				// 				this.hb_money = res.data.data.hb_money
				// 				this.money = res.data.data.money
				// 				this.jstime = res.data.data.jstime
				// 				this.y_number = res.data.data.y_number
				// 				this.title = res.data.data.title
				// 				this.face = res.data.data.avatar
				// 				this.is_guoqi = res.data.data.is_guoqi
				// 			}
				// 		})
						
				// 	}
				// })
				// uni.request({
				// 	url: this.G_base + '/api/lz/jfqadd',
				// 	method: 'POST',
				// 	header: {
				// 		'content-type': 'application/x-www-form-urlencoded',
				// 		'Authori-zation': 'Bearer ' + token
				// 	},
				// 	data: {
				// 		qid:this.groupid,
				// 		hb_id: this.rid,
				// 	},
				// 	success: res => {
				// 		console.log(res)
				// 		uni.request({
				// 			url: this.G_base + '/api/lz/jfhbinfo',
				// 			method: 'POST',
				// 			header: {
				// 				'content-type': 'application/x-www-form-urlencoded',
				// 				'Authori-zation': 'Bearer ' + token
				// 			},
				// 			data: {
				// 				qid:this.groupid,
				// 				hbid: this.rid,
				// 			},
				// 			success: res => {
				// 				console.log(res)
				// 				console.log("群主抢完查看")
				// 				this.personList = res.data.data.list
				// 				this.num = res.data.data.num
				// 				this.hb_money = res.data.data.hb_money
				// 				this.money = res.data.data.money
				// 				this.jstime = res.data.data.jstime
				// 				this.y_number = res.data.data.y_number
				// 				this.title = res.data.data.title
				// 				this.face = res.data.data.avatar
				// 				this.is_guoqi = res.data.data.is_guoqi
				// 			}
				// 		})
						
				// 	}
				// })
			}else{
				uni.request({
					url: this.G_base + '/api/lz/jfuserqb',
					method: 'POST',
					header: {
						'content-type': 'application/x-www-form-urlencoded',
						'Authori-zation': 'Bearer ' + token
					},
					data: {
						qid:this.groupid,
						hb_id: this.rid,
					},
					success: res => {
						console.log(res)
						uni.request({
							url: this.G_base + '/api/lz/jfhbinfo',
							method: 'POST',
							header: {
								'content-type': 'application/x-www-form-urlencoded',
								'Authori-zation': 'Bearer ' + token
							},
							data: {
								qid:this.groupid,
								hbid: this.rid,
							},
							success: res => {
								console.log(res)
								console.log("普通抢包")
								this.personList = res.data.data.list
								this.num = res.data.data.num
								this.hb_money = res.data.data.hb_money
								this.money = res.data.data.money
								this.jstime = res.data.data.jstime
								this.y_number = res.data.data.y_number
								this.title = res.data.data.title
								this.face = res.data.data.avatar
								this.is_guoqi = res.data.data.is_guoqi
								if(res.data.status==400){
									uni.showToast({
										title:res.data.msg,
										icon:'none'
									})
								}
							}
						})
						
					}
				})
			}
		},
		methods: {
			goback() {
				console.log("返回")
				uni.navigateBack({
					delta: 1
				})
			},
			qbsfind(msg){
				console.log(msg)
				if(msg.account=="抢包助手1"||msg.account=="抢包助手2"||msg.account=="抢包助手3"||msg.account=="抢包助手4"||msg.account=="抢包助手5"||msg.account=="抢包助手6"||msg.account=="抢包助手7"||msg.account=="抢包助手8"||msg.account=="抢包助手9"||msg.account=="抢包助手10"){
					uni.navigateTo({
						url:"/pages/moreperson/qbsperson?qid="+this.groupid+"&name="+msg.account
					})
				}
			}
		},
	}
</script>

<style>
	.lock {
		color: #F20;
	}

	.start {
		position: relative;
	}

	.nav {
		position: absolute;
		top: 0px;
		left: 5px;
		padding-top: 20px;
	}

	.topconttwo {
		width: 100%;
		height: 100px;
		border-radius: 50% 50%;
		background: -webkit-linear-gradient(left, #a00000, #e10004, #a00000);
		margin-top: -15%;
	}

	.topcontent {
		width: 100%;
		height: 60px;
		background: -webkit-linear-gradient(left, #a00000, #e10004, #a00000);
	}


	/* .right text {
		margin-right: 29px;
	} */

	.col {
		display: flex;
		flex-direction: column;
	}

	.left {
		display: flex;
		justify-content: flex-start;
		align-items: center;
	}

	.left image {
		margin-left: 19px;
		margin-right: 13px;
		width: 45px;
		height: 45px;
		border-radius: 90px;
	}

	.infoper {
		display: flex;
		justify-content: space-between;
		align-items: center;
		margin-top: 10px;
		border-bottom: 1px solid #CCCCCC;
	}

	.desc {
		margin-left: 12px;
		color: rgba(16, 16, 16, 1);
		font-size: 14px;
		text-align: left;
		font-family: PingFangSC-regular;
	}

	.content {
		margin-top: 25px;
		display: flex;
		justify-content: center;
		align-items: center;
		color: rgba(16, 16, 16, 1);
		font-size: 20px;
		text-align: left;
		font-family: PingFangSC-regular;
	}
</style>
